<template>
    <div style="width: 100%" class="conter">
        <el-form ref="form" class="title" inline style="margin-bottom: 50px">
            <el-form-item style="font-size: 32px;color: #333333;height: 40px;line-height: 40px;width: 100%">
                {{details.cuThearTitle}}
            </el-form-item>
            <el-form-item style="font-size: 24px;color: #999999;float: left;">{{details.authorName}}</el-form-item>
            <el-form-item style="font-size: 24px;color: #999999;float: right;">{{details.cuThearDate}}</el-form-item>
        </el-form>
        <div style="width: 100%" v-html="details.cuThearCenter"></div>
        <div>
            <el-divider></el-divider>
        </div>
    </div>
</template>

<script>
    export default {
        name: "thear",
        data() {
            return {
                details: {}
            }
        },
        methods: {
            queryDetails() {
                this.$axios.post("thear/queryDetails", {cuThearId: this.$route.params.code}).then((response) => {
                    if (response.data.code === 0) {
                        this.details = response.data.data;
                    }
                })
            }
        },
        mounted() {
            if (!this.$route.params.code) {
                this.$alert('<span style="vertical-align: middle;">非法进入</span> ', '提示', {
                    showCancelButton: false,
                    showConfirmButton: false,
                    dangerouslyUseHTMLString: true,
                    beforeClose: () => {

                    }
                });
            } else {
                this.queryDetails();
            }
        }
    }
</script>

<style scoped>


</style>
<style>
    .title {
    }

    .conter img {
        max-width: 100%;
    }
</style>